// fonts
$p-font-family: "Helvetica Neue", Helvetica, Tahoma, sans-serif;
$s-font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
$c-font-family: Menlo, Monaco, Consolas, "Courier New", monospace;

// colors
$i-color-1: #fff;
$i-color-2: #000;
$p-color-1: #00ADEE;
$p-color-2: #E95D22;
$p-color-3: #613D2D;
$p-color-4: #F8F094;
$s-color-1: #E1F0FF;
$s-color-2: #CCCCCC;
$s-color-3: #CCDFEE;
$s-color-4: #919499;
$s-color-5: #F0E020;
$s-color-6: #FFCC00;
$s-color-7: #99CC00;
$s-color-8: #AADBF5;
$s-color-9: #D5EEFB;
$s-color-10: #F5FBFF;
$s-color-11: #298EC3;
$s-color-12: #eeeeee;

// sizes
$max-width: 960px;
$p-size: 15px;

// paragraph
$line-height: 26px;
$padding: 10px;
$margin: 40px;
$font-size: 14px;

// table
$table-th-background: $s-color-8;
$table-td-background: $s-color-9;
$table-tr-hover-background: $s-color-3;

// buttons
$button-background-color: $s-color-1;
$button-color: $i-color-2;
$button-border-color: $s-color-1;
$button-font-family: $s-font-family;
$button-padding: 5px;

$button-hover-background-color: $p-color-1;
$button-hover-color: $s-color-1;
$button-hover-border-color: $p-color-1;

// grid variables
$grid-columns: 12;
$grid-max-width: 1040px;
$grid-gutter: 6px;

// breakpoints
$breakpoint-mobile: "only screen and (min-width: 480px)";
$breakpoint-tablet: "only screen and (min-width: 720px)";